<template>
	<view>
		<cu-custom bgColor="bg-red" :isBack="true">		<block slot="backText"></block>
			<block slot="content">{{title}}</block>
		</cu-custom>
		<scroll-view scroll-x class="bg-white nav text-center">
			<view class="cu-item" v-for="(item,index) in listObj" :key="index" :class="index==TabCur?'cur text-'+theme:'text-gray'"
			 @tap="tabSelect" :data-id="index">
				{{item.title}}
			</view>
		</scroll-view>

		<view v-for="(item,index) in listObj" :key="index" v-if="index==TabCur">
			<block v-for="(order ,i) in item.list" :key="i">
				<orderView :item="order" v-on:reloadList="reloadList"></orderView>
			</block>
			<view class="cu-load margin-center" :class="item.loading?'loading':'over'"></view>
		</view>
	</view>
</template>

<script>
	import orderView from '@/components/shop/orderView.vue'
	import {
		mapState
	} from 'vuex'
	export default {
		components: {
			orderView,
		},
		computed: mapState(['forcedLogin', 'hasLogin', 'channelLogin']),
		data() {
			return {
				theme: this.$config.THEME(),
				TabCur: 0,
				is_channel: 0,
				title: '订单中心',
				listObj: [{
						title: '全部',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 0
					},
					{
						title: '待付款',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 1
					}, {
						title: '进行中',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 2
					},
					{
						title: '待收货',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 3
					},
					{
						title: '待评价',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 4
					},
					{
						title: '已评价',
						list: [],
						hasMore: true,
						loading: false,
						page: 1,
						type: 5
					},
				],
			};
		},
		onLoad(options) {
			if (options.status)
				this.TabCur = parseInt(options.status)

			if (options.is_channel) {
				this.is_channel = options.is_channel
				this.title = '进货订单'
			}

			if (this.$common.loginAuth(true)) {
				this.$nextTick(function() {
					uni.startPullDownRefresh({})
				})
			}
		},
		onShow() {
			if (this.$common.loginAuth(true)) {
				if (this.$common.getCache('order_reload')) {
					this.$common.rmCache('order_reload')
					this.$nextTick(function() {
						uni.startPullDownRefresh({})
					})
				}
			}
		},
		methods: {
			tabSelect(e) {
				if (this.TabCur != e.currentTarget.dataset.id) {
					this.TabCur = e.currentTarget.dataset.id
					this.listObj[this.TabCur].list = []
					this.listObj[this.TabCur].hasMore = true
					this.listObj[this.TabCur].page = 1
					this.listObj[this.TabCur].loading = false
					this.getList(this.TabCur)
				}
			},
			getList(index) {
				let obj = this.listObj[index]
				if (!obj.hasMore || obj.loading) return

				this.listObj[index].loading = true
				let params = {
					page: obj.page,
					is_channel: this.is_channel,
				}
				if (obj.type > 0) {
					params.synthesize_status = obj.type - 1
				}
				this.$http
					.get('order_index', params)
					.then((response) => {
						console.log(response)
						let list = obj.list
						if (response.data.data.length > 0) {
							list = list.concat(response.data.data)
						} else {
							this.listObj[index].hasMore = false
						}
						this.listObj[index].list = list
						this.listObj[index].loading = false
						this.listObj[index].page++
						uni.stopPullDownRefresh()
					})
					.catch((response) => {
						console.log(response)
					})
			},
			reloadList() {
				uni.startPullDownRefresh({})
			}
		},
		onPullDownRefresh() {
			this.listObj[this.TabCur].list = []
			this.listObj[this.TabCur].hasMore = true
			this.listObj[this.TabCur].page = 1
			this.listObj[this.TabCur].loading = false
			this.getList(this.TabCur)
		},
		onReachBottom() {
			this.getList(this.TabCur)
		},
	}
</script>

<style>
</style>
